<!DOCTYPE html>
<html lang="en">
<head>
    <title>My Order</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    <link rel="stylesheet" href="layui/css/layui.css">
    <script src="/layui/layui.js"></script>
    <script type="text/javascript" src="js/jquery/jquery.min.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <!-- GOOGLE WEB FONTS -->
    <link rel="stylesheet" href="css/font-awesome.min.css">

    <!-- BOOTSTRAP 3.3.7 CSS -->
    <link rel="stylesheet" href="css/bootstrap.min.css" />

    <!-- SLICK v1.6.0 CSS -->
    <link rel="stylesheet" href="css/slick-1.6.0/slick.css" />

    <link rel="stylesheet" href="css/jquery.fancybox.css" />
    <link rel="stylesheet" href="css/yith-woocommerce-compare/colorbox.css" />
    <link rel="stylesheet" href="css/owl-carousel/owl.carousel.min.css" />
    <link rel="stylesheet" href="css/owl-carousel/owl.theme.default.min.css" />
    <link rel="stylesheet" href="css/js_composer/js_composer.min.css" />
    <link rel="stylesheet" href="css/woocommerce/woocommerce.css" />
    <link rel="stylesheet" href="css/yith-woocommerce-wishlist/style.css" />


    <link rel="stylesheet" href="css/custom.css" />
    <link rel="stylesheet" href="css/app-orange.css" id="theme_color" />
    <link rel="stylesheet" href="" id="rtl" />
    <link rel="stylesheet" href="css/app-responsive.css" />

    <style>
        .buttonColor:hover{
            color: #ffaa00;
        }
        .buttonColor{
            color: black;
        }
    </style>
</head>

<body class="page woocommerce-account woocommerce-page">




<div class="body-wrapper theme-clearfix" >
    <header id="header" class="header header-style1">
        <div class="header-top clearfix">
            <div class="container">
                <div class="rows">
                    <!-- SIDEBAR TOP MENU -->
                    <div class="pull-left top1">
                        <div class="widget text-2 widget_text pull-left">
                            <div class="widget-inner">
                                <div class="textwidget">
                                    <div class="call-us"><span>联系我们: </span>023-8888-8888</div>
                                </div>
                            </div>
                        </div>

                    </div>

                    <div class="wrap-myacc pull-right">
                        <div class="sidebar-account pull-left">
                            <div class="account-title">My account</div>

                            <div id="my-account" class="my-account">
                                <div class="widget-1 widget-first widget nav_menu-4 widget_nav_menu">
                                    <div class="widget-inner">
                                        <ul id="menu-my-account" class="menu">
                                            <li class="menu-my-account">
                                                <a class="item-link" href="my_account.html">
                                                    <span class="menu-title">My Account</span>
                                                </a>
                                            </li>

                                            <li class="menu-cart">
                                                <a class="item-link" href="cart.html">
                                                    <span class="menu-title">Cart</span>
                                                </a>
                                            </li>

                                            <li class="menu-checkout">
                                                <a class="item-link" href="checkout.html">
                                                    <span class="menu-title">Checkout</span>
                                                </a>
                                            </li>

                                            <li class="menu-wishlist">
                                                <a class="item-link" href="#">
                                                    <span class="menu-title">Wishlist</span>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>

                                <div class="widget-2 widget-last widget sw_top-4 sw_top">
                                    <div class="widget-inner">
                                        <div class="top-login">
                                            <div class="div-logined">
                                                <ul>
                                                    <li>
                                                        <a href="javascript:void(0);" data-toggle="modal" data-target="#login_form">
                                                            <span>Login</span>
                                                        </a>
                                                        <span class="wg">Welcome Guest</span>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="pull-left top2">
                            <div class="widget-1 widget-first widget nav_menu-2 widget_nav_menu">
                                <div class="widget-inner">
                                    <ul id="menu-checkout" class="menu">
                                        <li class="menu-checkout">
                                            <a class="item-link" href="checkout.html">
                                                <span class="menu-title">Checkout</span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>



        <div class="header-bottom clearfix">
            <div class="container">
                <div class="rows">
                    <!-- Primary navbar -->
                    <div id="main-menu" class="main-menu">
                        <nav id="primary-menu" class="primary-menu">
                            <div class="navbar-inner navbar-inverse">
                                <div class="resmenu-container">
                                    <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#ResMenuprimary_menu">
                                        <span class="sr-only">Categories</span>
                                        <span class="icon-bar"></span>
                                        <span class="icon-bar"></span>
                                        <span class="icon-bar"></span>
                                    </button>

                                    <div id="ResMenuprimary_menu" class="collapse menu-responsive-wrapper">
                                        <ul id="menu-primary-menu" class="etrostore_resmenu">
                                            <li><a href="/homePage">首&nbsp;&nbsp;页</a></li>
                                            <li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</li>
                                            <li><a href="/user/cartPage">购物车</a></li>
                                            <li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</li>
                                            <li><a href="/loginPage">登录/注册</a></li>
                                            <li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</li>
                                            <li><a href="/user/myAccountPage">个人中心</a></li>
                                            <li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</li>
                                            <li><a href="/aboutUsPage">关于我们</a></li>
                                        </ul>
                                    </div>
                                </div>

                                <ul id="menu-primary-menu-1" class="nav nav-pills nav-mega etrostore-mega etrostore-menures">
                                    <li><a href="/homePage">首&nbsp;&nbsp;页</a></li>
                                    <li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</li>
                                    <li><a href="/user/cartPage">购物车</a></li>
                                    <li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</li>
                                    <li><a href="/loginPage">登录/注册</a></li>
                                    <li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</li>
                                    <li><a href="/user/myAccountPage">个人中心</a></li>
                                    <li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</li>
                                    <li><a href="/aboutUsPage">关于我们</a></li>
                                </ul>
                            </div>
                        </nav>
                    </div>
                    <!-- /Primary navbar -->

                    <div class="top-form top-form-minicart etrostore-minicart pull-right">
                        <div class="top-minicart-icon pull-right">
                            <i class="fa fa-shopping-cart"></i>
                            <a class="cart-contents" href="cart.html" title="View your shopping cart">
                                <span class="minicart-number">2</span>
                            </a>
                        </div>

                        <div class="wrapp-minicart">
                            <div class="minicart-padding">
                                <div class="number-item">
                                    There are <span>items</span> in your cart
                                </div>

                                <ul class="minicart-content">
                                    <li>
                                        <a href="simple_product.html" class="product-image">
                                            <img 	width="100" height="100" src="static/images/1903/45-150x150.jpg" class="attachment-100x100 size-100x100 wp-post-image" alt=""
                                                    srcset="static/images/1903/45-150x150.jpg 150w, static/images/1903/45-300x300.jpg 300w, static/images/1903/45-180x180.jpg 180w, static/images/1903/45.jpg 600w"
                                                    sizes="(max-width: 100px) 100vw, 100px" />
                                        </a>

                                        <div class="detail-item">
                                            <div class="product-details">
                                                <h4>
                                                    <a class="title-item" href="simple_product.html">Veniam Dolore</a>
                                                </h4>

                                                <div class="product-price">
														<span class="price">
															<span class="woocommerce-Price-amount amount">
																<span class="woocommerce-Price-currencySymbol">$</span>190.00
															</span>
														</span>

                                                    <div class="qty">
                                                        <span class="qty-number">1</span>
                                                    </div>
                                                </div>

                                                <div class="product-action clearfix">
                                                    <a href="#" class="btn-remove" title="Remove this item">
                                                        <span class="fa fa-trash-o"></span>
                                                    </a>

                                                    <a class="btn-edit" href="cart.html" title="View your shopping cart">
                                                        <span class="fa fa-pencil"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </div>
                                    </li>

                                    <li>
                                        <a href="simple_product.html" class="product-image">
                                            <img	 width="100" height="100" src="static/images/1903/22-150x150.jpg" class="attachment-100x100 size-100x100 wp-post-image" alt=""
                                                     srcset="static/images/1903/22-150x150.jpg 150w, static/images/1903/22-300x300.jpg 300w, static/images/1903/22-180x180.jpg 180w, static/images/1903/22.jpg 600w"
                                                     sizes="(max-width: 100px) 100vw, 100px" />
                                        </a>

                                        <div class="detail-item">
                                            <div class="product-details">
                                                <h4>
                                                    <a class="title-item" href="simple_product.html">Cleaner with bag</a>
                                                </h4>

                                                <div class="product-price">
														<span class="price">
															<span class="woocommerce-Price-amount amount">
																<span class="woocommerce-Price-currencySymbol">$</span>350.00
															</span>
														</span>

                                                    <div class="qty">
                                                        <span class="qty-number">1</span>
                                                    </div>
                                                </div>

                                                <div class="product-action clearfix">
                                                    <a href="#" class="btn-remove" title="Remove this item">
                                                        <span class="fa fa-trash-o"></span>
                                                    </a>

                                                    <a class="btn-edit" href="cart.html" title="View your shopping cart">
                                                        <span class="fa fa-pencil"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                </ul>

                                <div class="cart-checkout">
                                    <div class="price-total">
                                        <span class="label-price-total">Total</span>

                                        <span class="price-total-w">
												<span class="price">
													<span class="woocommerce-Price-amount amount">
														<span class="woocommerce-Price-currencySymbol">$</span>540.00
													</span>
												</span>
											</span>
                                    </div>

                                    <div class="cart-links clearfix">
                                        <div class="cart-link">
                                            <a href="cart.html" title="Cart">View Cart</a>
                                        </div>

                                        <div class="checkout-link">
                                            <a href="checkout.html" title="Check Out">Check Out</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="mid-header pull-right">
                        <div class="widget sw_top">
								<span class="stick-sr">
									<i class="fa fa-search" aria-hidden="true"></i>
								</span>

                            <div class="top-form top-search">
                                <div class="topsearch-entry">
                                    <form role="search" method="get" class="form-search searchform" action="">
                                        <label class="hide"></label>
                                        <input type="text" value="" name="s" class="search-query" placeholder="Keyword here..." />
                                        <button type="submit" class="button-search-pro form-button">Search</button>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </header>

    <div class="listings-title">
        <div class="container">
            <div class="wrap-title">
                <h1>个人中心</h1>
                <div class="bread">
                    <div class="breadcrumbs theme-clearfix">
                        <div class="container">
                            <ul class="breadcrumb">
                                <li>
                                    <a href="/homePage">首页</a>
                                    <span class="go-page"></span>
                                </li>

                                <li class="active">
                                    <span>个人中心</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="container">
        <div class="row">
            <div id="contents" role="main" class="main-page  col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <div class="post-6 page type-page status-publish hentry">
                    <div class="entry">
                        <div class="entry-content">
                            <header>
                                <h2 class="entry-title"></h2>
                            </header>

                            <div class="entry-content">
                                <div class="woocommerce">
                                    <nav class="woocommerce-MyAccount-navigation">

                                        <ul class="buttonColor">
                                            <li class="is-active">
                                                <a href="/user/myAccountPage "  style="color: black ">个人信息</a>
                                            </li>

                                            <li >
                                                <a style="color: #ffaa00">订单</a>
                                            </li>

                                            <li>
                                                <a href="/user/addressPage ">地址管理</a>
                                            </li>

                                            <li>
                                                <a href="/user/afterSalePage ">售后</a>
                                            </li>

                                            <li>
                                                <a href="/agreementPage ">用户协议</a>
                                            </li>

                                            <li>
                                                <a href="/loginPage" onclick="loginOut()">登出</a>

                                            </li>


                                        </ul>

                                    </nav>

                                    <div class="woocommerce-MyAccount-content">


<!--                                        <div class="woocommerce-MyAccount-content">-->
<!--                                            <table class="shop_table shop_table_responsive my_account_orders account-orders-table" id="order_table">-->
<!--                                                <thead>-->
<!--                                                <tr>-->
<!--                                                    <th class="order-number"><span class="nobr">订单号</span></th>-->
<!--                                                    <th class="order-date"><span class="nobr">日期</span></th>-->
<!--                                                    <th class="order-status"><span class="nobr">状态</span></th>-->
<!--                                                    <th class="order-total"><span class="nobr">总价</span></th>-->
<!--                                                    <th class="order-actions"><span class="nobr">&nbsp;</span></th>-->
<!--                                                </tr>-->
<!--                                                </thead>-->

<!--                                                <tbody>-->
<!--                                                <tr class="order">-->
<!--                                                    <td class="order-number" data-title="Order">-->
<!--                                                        465465165-->
<!--                                                    </td>-->
<!--                                                    <td class="order-date" data-title="Date">-->
<!--                                                        2021-8-6-->
<!--                                                    </td>-->
<!--                                                    <td class="order-status" data-title="Status">-->
<!--                                                        待支付-->
<!--                                                    </td>-->
<!--                                                    <td class="order-total" data-title="Total">-->
<!--                                                        ￥100-->
<!--                                                    </td>-->

<!--                                                    <td class="order-actions" data-title="&nbsp;">-->
<!--                                                        <a href="" class="button view">查看详情</a>-->
<!--                                                    </td>-->
<!--                                                </tr>-->
<!--                                                </tbody>-->
<!--                                            </table>-->
<!--                                        </div>-->

                                        <!--订单数据表-->
                                        <div id="order_div">
                                            <table id="order_table" lay-filter="order_table"></table>
                                        </div>



                                        <div id="pay_div"></div>
                                        <div id="detail_div"></div>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


</div>

<!-- DIALOGS -->
<div class="modal fade" id="search_form" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog block-popup-search-form">
        <form role="search" method="get" class="form-search searchform" action="">
            <input type="text" value="" name="s" class="search-query" placeholder="Enter your keyword..." />

            <button type="submit" class="fa fa-search button-search-pro form-button"></button>

            <a href="javascript:void(0)" title="Close" class="close close-search" data-dismiss="modal">X</a>
        </form>
    </div>
</div>

<div class="modal fade" id="login_form" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog block-popup-login">
        <a href="javascript:void(0)" title="Close" class="close close-login" data-dismiss="modal">Close</a>

        <div class="tt_popup_login">
            <strong>Sign in Or Register</strong>
        </div>

        <form action="" method="post" class="login">
            <div class="block-content">
                <div class="col-reg registered-account">
                    <div class="email-input">
                        <input type="text" class="form-control input-text username" name="username" id="username" placeholder="Username" />
                    </div>

                    <div class="pass-input">
                        <input class="form-control input-text password" type="password" placeholder="Password" name="password" id="password" />
                    </div>

                    <div class="ft-link-p">
                        <a href="#" title="Forgot your password">Forgot your password?</a>
                    </div>

                    <div class="actions">
                        <div class="submit-login">
                            <input type="submit" class="button btn-submit-login" name="login" value="Login" />
                        </div>
                    </div>
                </div>

                <div class="col-reg login-customer">
                    <h2>NEW HERE?</h2>

                    <p class="note-reg">Registration is free and easy!</p>

                    <ul class="list-log">
                        <li>Faster checkout</li>

                        <li>Save multiple shipping addresses</li>

                        <li>View and track orders and more</li>
                    </ul>

                    <a href="create_account.html" title="Register" class="btn-reg-popup">Create an account</a>
                </div>
            </div>
        </form>
        <div class="clear"></div>
    </div>
</div>

<a id="etrostore-totop" href="#"></a>

<div id="subscribe_popup" class="subscribe-popup" style="background: url(/static/images/icons/bg_newsletter.jpg)">
    <div class="subscribe-popup-container">
        <h2>Join our newsletter</h2>
        <div class="description">Subscribe now to get 40% of on any product!</div>
        <div class="subscribe-form">
            <form id="mc4wp-form-2" class="mc4wp-form mc4wp-form-275" method="post" data-id="275" data-name="">
                <div class="mc4wp-form-fields">
                    <div class="newsletter-content">
                        <input type="email" class="newsletter-email" name="EMAIL" placeholder="Your email" required="" />
                        <input class="newsletter-submit" type="submit" value="Subscribe" />
                    </div>
                </div>
                <div class="mc4wp-response"></div>
            </form>
        </div>

        <div class="subscribe-checkbox">
            <label for="popup_check">
                <input id="popup_check" name="popup_check" type="checkbox" />
                <span>Don't show this popup again!</span>
            </label>
        </div>

        <div class="subscribe-social">
            <div class="subscribe-social-inner">
                <a href="#" class="social-fb">
                    <span class="fa fa-facebook"></span>
                </a>

                <a href="#" class="social-tw">
                    <span class="fa fa-twitter"></span>
                </a>

                <a href="#" class="social-gplus">
                    <span class="fa fa-google-plus"></span>
                </a>

                <a href="#" class="social-pin">
                    <span class="fa fa-instagram"></span>
                </a>

                <a href="#" class="social-linkedin">
                    <span class="fa fa-pinterest-p"></span>
                </a>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript" src="js/jquery/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery/jquery-migrate.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/jquery/js.cookie.min.js"></script>

<!-- OPEN LIBS JS -->
<script type="text/javascript" src="js/owl-carousel/owl.carousel.min.js"></script>
<script type="text/javascript" src="js/slick-1.6.0/slick.min.js"></script>

<script type="text/javascript" src="js/yith-woocommerce-compare/jquery.colorbox-min.js"></script>
<script type="text/javascript" src="js/sw_core/isotope.js"></script>
<script type="text/javascript" src="js/sw_core/jquery.fancybox.pack.js"></script>
<script type="text/javascript" src="js/sw_woocommerce/category-ajax.js"></script>
<script type="text/javascript" src="js/sw_woocommerce/jquery.countdown.min.js"></script>
<script type="text/javascript" src="js/js_composer/js_composer_front.min.js"></script>

<script type="text/javascript" src="js/plugins.js"></script>
<script type="text/javascript" src="js/megamenu.min.js"></script>
<script type="text/javascript" src="js/main.min.js"></script>

<script type="text/javascript">
    var sticky_navigation_offset_top = $("#header .header-bottom").offset().top;
    var sticky_navigation = function(){
        var scroll_top = $(window).scrollTop();
        if (scroll_top > sticky_navigation_offset_top) {
            $("#header .header-bottom").addClass("sticky-menu");
            $("#header .header-bottom").css({ "top":0, "left":0, "right" : 0 });
        } else {
            $("#header .header-bottom").removeClass("sticky-menu");
        }
    };
    sticky_navigation();
    $(window).scroll(function() {
        sticky_navigation();
    });

    $(document).ready (function () {
        $( ".show-dropdown" ).each(function(){
            $(this).on("click", function(){
                $(this).toggleClass("show");
                var $element = $(this).parent().find( "> ul" );
                $element.toggle( 300 );
            });
        });
    });
</script>

<!--[if gte IE 9]><!-->
<script type="text/javascript">
    var request, b = document.body, c = 'className', cs = 'customize-support', rcs = new RegExp('(^|\\s+)(no-)?'+cs+'(\\s+|$)');
    request = true;

    b[c] = b[c].replace( rcs, ' ' );
    // The customizer requires postMessage and CORS (if the site is cross domain)
    b[c] += ( window.postMessage && request ? ' ' : ' no-' ) + cs;
</script>
<!--<![endif]-->




<!--<script type="text/html" id="orderToolbar">-->
<!--    <div class="layui-btn-container">-->
<!--        <button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>-->
<!--        <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>-->
<!--        <button class="layui-btn layui-btn-sm" lay-event="isAll">验证是否全选</button>-->
<!--    </div>-->
<!--</script>-->

<script type="text/html" id="orderBar">


        <a class="layui-btn layui-btn-xs" lay-event="payOrder" id="pay_button">去支付</a>
        <a class="layui-btn layui-btn-xs" lay-event="orderDetail">查看详情</a>

</script>

<!--管理员数据表js-->
<script>
    layui.use('table', function(){
        var table = layui.table;

        //渲染数据
        table.render({
            elem: '#order_table'
            ,height: 600
            ,toolbar:true
            ,toolbar: '#orderToolbar' //开启头部工具栏，并为其绑定左侧模板
            ,defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
                title: '提示'
                ,layEvent: 'LAYTABLE_TIPS'
                ,icon: 'layui-icon-tips'
            }]
            ,title: '订单数据表'
            ,method:'get'
            ,url: '/user/orderList' //数据接口
            ,page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
                //,curr: 5 //设定初始在第 5 页
                ,groups: 1 //只显示 1 个连续页码
                ,first: false //不显示首页
                ,last: false //不显示尾页

            } //开启分页
            // ,response: {
            //     statusCode: 200 //重新规定成功的状态码为 200，table 组件默认为 0
            // }
            ,parseData: function(res){ //将原始数据解析成 table 组件所规定的数据
                return {
                    "code": 0, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    //"count": 0, //解析数据长度
                    "data": res.data.list //解析数据列表
                };
            }
            ,cols: [[//表头
                {type: 'checkbox', fixed: 'left'}
                ,{field: 'orderId', title: '订单编号', width:80, sort: true  }
                ,{field: 'orderPrice', title: '总价格￥', width:80 }
                ,{field: 'receiveName', title: '收件人姓名', width:80 }
                ,{field: 'receivePhone', title: '收件人手机', width:120 }
                // ,{field: 'receiveProvince', title: '省', width:80 }
                // ,{field: 'receiveCity', title: '市', width:80}
                // ,{field: 'receiveRegion', title: '区', width:80 }
                // ,{field: 'receiveAddressDetail', title: '地址详情', width:150 }
                // ,{field: 'trackingNumber', title: '物流单号', width:80}
                ,{field: 'paymentType', title: '订单类型', width:90 }
                ,{field: 'orderState', title: '订单状态', width:90}

                //,{field: 'orderItemList', title: '订单商品', width:80 }
                ,{fixed: 'right', title:'操作', toolbar: '#orderBar', width:160, fixed: 'right'}
            ]]

        });

        //头工具栏事件
        table.on('toolbar(order_table)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
                case 'getCheckData':
                    var data = checkStatus.data;
                    layer.alert(JSON.stringify(data));
                    break;
                case 'getCheckLength':
                    var data = checkStatus.data;
                    layer.msg('选中了：'+ data.length + ' 个');
                    break;
                case 'isAll':
                    layer.msg(checkStatus.isAll ? '全选': '未全选');
                    break;

                //自定义头工具栏右侧图标 - 提示
                case 'LAYTABLE_TIPS':
                    layer.alert('这是工具栏右侧自定义的一个图标按钮');
                    break;
            };
        });

        //监听行工具事件
        table.on('tool(order_table)', function(obj){
            var data = obj.data;
            //console.log(obj)
            if(obj.event === 'del'){
                layer.confirm('真的删除行么', function(index){
                    obj.del();
                    layer.close(index);
                });
            } else if(obj.event === 'edit'){
                layer.prompt({
                    formType: 2
                    ,value: data.email
                }, function(value, index){
                    obj.update({
                        email: value
                    });
                    layer.close(index);
                });
            }else if(obj.event === 'payOrder'){

                var orderIdInput = data.orderId;
                $("#order_id").val(orderIdInput);
                $("#show_order_id").text(data.orderId);
                $("#show_order_price").text(data.orderPrice);

                $("#order_div").hide();
                $("#pay_div").show();

            }else if(obj.event === 'orderDetail'){

                $("#detail_order_id").text( data.orderId);
                $("#detail_product_name").text( data.orderItemList[0].searchedProductVO.productName);
                $("#detail_product_num").text( data.orderItemList[0].orderItemAmount);
                $("#detail_total_price").text( data.orderPrice);
                $("#detail_username").text( data.receiveName);
                $("#detail_phone").text( data.receivePhone);
                $("#detail_receiveProvince").text( data.receiveProvince);
                $("#detail_receiveCity").text( data.receiveCity);
                $("#detail_receiveRegion").text( data.receiveRegion);
                $("#detail_receiveAddressDetail").text( data.receiveAddressDetail);
                $("#show_qrCode").attr("src", data.orderItemList[0].qrCode);


                $("#order_div").hide();
                $("#detail_div").show();

            }
        });


    });


    //加载结算页面到div
    $("#pay_div").html(''); //加载页面的div先清空
    var bodyContent = $.ajax({
        url: "/user/payOrder",//加载html的地址
        global: false,
        type: "GET",
        dataType: "html",
        async: false,
        success: function (msg) {
            $("#pay_div").html(msg);
            //console.log(msg);
        },
        return: false,
    })

    //加载订单详情页面到div
    $("#detail_div").html(''); //加载页面的div先清空
    var Content = $.ajax({
        url: "/orderDetailPage",//加载html的地址
        global: false,
        type: "GET",
        dataType: "html",
        async: false,
        success: function (msg) {
            $("#detail_div").html(msg);
            //console.log(msg);
        },
        return: false,
    })

    //进入页面时隐藏支付和详情的盒子
    $(document).ready(function() {
         $("#pay_div").hide();
         $("#detail_div").hide();
         $("#order_div").show();
     })



</script>




